<template>
  <div class="more" @click.stop>
    <van-popover
      v-model:show="showPopover"
      :actions="actions"
      @select="onSelect"
      placement="top"
    >
      <template #reference> 更多 </template>
    </van-popover>
  </div>
</template>

<script setup lang="ts">
import type { PopoverAction } from 'vant'
import { ref } from 'vue'
const props = defineProps<{
  prescriptionId?: string
}>()
const showPopover = ref(false)
const actions = [
  { text: '查看处方', disabled: !props.prescriptionId },
  { text: '删除订单' }
]

const emits = defineEmits<{
  (e: 'showPre'): void
  (e: 'del'): void
}>()
const onSelect = async (action: PopoverAction, index: number) => {
  // console.log(action, index)
  if (index === 0) emits('showPre')
  if (index === 1) emits('del')
}
</script>

<style scoped>
.more {
  color: var(--cp-tag);
  flex: 1;
  font-size: 13px;
}
</style>
